<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <link rel='stylesheet' type='text/css' href='css/css.css' media='all'>
        <title>Đăng ký</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width">
    </head>
    <body>
        <div id='login-area'>
            <div id='login-head'>
                Tạo tài khoản
            </div>
            <form action='register.php' method='POST'>
                <div class='login-div'>
                    <div class='login-img'>
                        <img src='Images/users.png' width='60' height='60' alt='img-user'/>
                        <div class='login-hidden-info'>
                            Tên đăng nhập dùng để đăng nhập vào website đòng thời là tên hiển thị khi trò chuyện.<br/>
                            Tên đăng nhập có độ dài từ 4 đến 20 ký tự, không sử dụng ký tự đặc biệt.<br/>                            
                            <span class='meo'>Mẹo:</span> bạn có thể ấn nút kiểm tra để xác định mức độ hợp lệ.
                        </div>
                    </div>
                <div class='login-input'>
                    <label class='login-label' for='name'>
                        Tên đăng nhập: <span id='id-checked' class='check-done'></span>
                    </label><br>
                    <input type='text' name='name' id='name' value='' size='20' tabindex='1' class='login-textbox'>
                    
                </div>
                    <div class='check-area'>
                        <div id='id-check' class='check-button'>Kiểm tra</div>
                    </div>
                </div><!-- End Login-div -->
                <div class='login-div'>
                    <div class='login-img'>
                        <img src='Images/pass.png' width='60' height='60' alt='img-user'/>
                        <div class='login-hidden-info'>
                            Mật khẩu dùng để xác minh tài khoản khi đăng nhập vào trang web<br/>
                            Mật khẩu có độ dài từ 5 đến 20 ký tự, có thể dùng ký tự đặc biệt như: @,-<br/>                            
                            <span class='meo'>Mẹo:</span> bạn có thể ấn nút kiểm tra để xác định mức độ hợp lệ.
                        </div>
                    </div>
                
                <div class='login-input'>
                    <label class='login-label' for='pass'>
                        Nhập Password: <span id='id-checked' class='check-done'></span>
                    </label><br>
                    <input type='password' name='pass1' id='password' value='' size='20' tabindex='2' class='login-textbox'>
                </div>
                    <div class='check-area'>
                        <div id='pass-check' class='check-button'>Kiểm tra</div>
                    </div>
                    </div><!-- End Login-div -->
                <div class='login-div'>
                    <div class='login-img'>
                        <img src='Images/repass.png' width='60' height='60' alt='img-user'/>
                       <div class='login-hidden-info'>
                            Nhập lại mật khẩu để tránh các sai sót do đánh máy.<br/>
                            Mật khẩu nhập lại phải trùng với mật khẩu bên trên.
                        </div>
                    </div>
                
                <div class='login-input'>
                    <label class='login-label' for='pass'>
                        Nhập lại Password: <span id='id-checked' class='check-done'></span>
                    </label><br>
                    <input type='password' name='pass2' id='password' value='' size='20' tabindex='3' class='login-textbox'>
                </div>
                    </div><!-- End Login-div -->
                <div class='login-div'>
                    <div class='login-img'>
                        <img src='Images/email.png' width='60' height='60' alt='img-user'/>
                        <div class='login-hidden-info'>
                            Email dùng để xác minh mật khẩu khi bị mất, hoặc nhận các thông tin từ trang web.<br/>
                            Email phải có ký tự @ và phần đuôi hợp lệ.<br/>                            
                            <span class='meo'>Mẹo:</span> bạn có thể ấn nút kiểm tra để xác định mức độ hợp lệ.
                        </div>
                    </div>
                
                <div class='login-input'>
                    <label class='login-label' for='pass'>
                        Nhập Email: <span id='id-checked' class='check-done'></span>
                    </label><br>
                    <input type='text' name='email' id='email' value='' size='20' tabindex='4' class='login-textbox'>
                </div>
                    <div class='check-area'>
                        <div id='id-check' class='check-button'>Kiểm tra</div>
                    </div>
                    </div><!-- End Login-div -->
                <div class='login-div'>
                    <div class='login-img'>
                        <img src='Images/language.png' width='60' height='60' alt='img-user'/>
                        <div class='login-hidden-info'>
                            Chọn ngôn ngữ để hiển thị trong trang web, trang web sẽ tự chuyển nội dung trò chuyện sang ngôn ngữ này.<br/>
                            Bạn có thể chọn lại ngôn ngữ trong trang cá nhân.<br/>                            
                        </div>
                    </div>
                <div class='login-input'>
                    <label class='login-label' for='laguage'>Chọn ngôn ngữ:</label><br>
                    <select name='language' tabindex='5' class='login-select'>
                        <option value='vie'>Tiếng Việt</option>
                        <option value='eng'>Tiếng Anh</option>
                    </select>
                </div>
                </div><!-- End Login-div -->
                <div id='login-input-area'>
                    <div><input type='submit' name='submit' value='Đăng ký' tabindex='6'></div>
                     <div class='login-button'><a href='template-register.html' >Đăng nhập</a></div>
                      <div class='login-button'><a href='template-register.html' >Quên mật khẩu</a></div>
                </div>
            </form>
        </div>
    </body>
</html>
